<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/jsp/taglib.jsp"%>
<%@ page import="com.framework.utils.ConfigUtil" %>
<!DOCTYPE html>
<html>
<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>信息编辑窗体</title>
    <meta name="keywords" content="">
    <meta name="description" content="">

    <link href="${ctxStatic}/plugins/h+/css/bootstrap.min14ed.css?v=3.3.6" rel="stylesheet">
    <link href="${ctxStatic}/plugins/h+/css/plugins/bootstrap-table/bootstrap-table.min.css" rel="stylesheet">
    <link href="${ctxStatic}/plugins/h+/css/animate.min.css" rel="stylesheet">
    <%--<link href="${ctxStatic}/plugins/h+/css/style.min862f.css?v=4.1.0" rel="stylesheet">--%>
    <link rel="stylesheet" type="text/css" href="${ctxStatic}/plugins/h+/css/plugins/webuploader/webuploader.css">
    <link href="${ctxStatic}/plugins/h+/css/plugins/sweetalert/sweetalert.css" rel="stylesheet">

    <link href="${ctxStatic}/plugins/h+/css/font-awesome.min.css" rel="stylesheet">
    <link href="${ctxStatic}/plugins/h+/css/plugins/iCheck/custom.css" rel="stylesheet">
    <link href="${ctxStatic}/plugins/h+/css/plugins/chosen/chosen.css" rel="stylesheet">
    <link href="${ctxStatic}/plugins/h+/css/plugins/colorpicker/css/bootstrap-colorpicker.min.css" rel="stylesheet">
    <link href="${ctxStatic}/plugins/h+/css/plugins/cropper/cropper.min.css" rel="stylesheet">
    <link href="${ctxStatic}/plugins/h+/css/plugins/switchery/switchery.css" rel="stylesheet">
    <link href="${ctxStatic}/plugins/h+/css/plugins/jasny/jasny-bootstrap.min.css" rel="stylesheet">
    <link href="${ctxStatic}/plugins/h+/css/plugins/nouslider/jquery.nouislider.css" rel="stylesheet">
    <link href="${ctxStatic}/plugins/h+/css/plugins/datapicker/datepicker3.css" rel="stylesheet">
    <link href="${ctxStatic}/plugins/h+/css/plugins/ionRangeSlider/ion.rangeSlider.css" rel="stylesheet">
    <link href="${ctxStatic}/plugins/h+/css/plugins/ionRangeSlider/ion.rangeSlider.skinFlat.css" rel="stylesheet">
    <link href="${ctxStatic}/plugins/h+/css/plugins/awesome-bootstrap-checkbox/awesome-bootstrap-checkbox.css" rel="stylesheet">
    <link href="${ctxStatic}/plugins/h+/css/plugins/clockpicker/clockpicker.css" rel="stylesheet">
    <link href="${ctxStatic}/plugins/h+/css/animate.min.css" rel="stylesheet">
    <link href="${ctxStatic}/plugins/h+/css/style.min.css?v=4.0.0" rel="stylesheet"><base target="_blank">
    <link href="${pageContext.request.contextPath}/resources/plugins/h+/css/plugins/jsTree/style.min.css" rel="stylesheet">
    <style>
        .jstree-open>.jstree-anchor>.fa-folder:before{content:"\f07c"}.jstree-default .jstree-icon.none{width:0}
        .dtupload>img{
             width: 54px;
             padding-left: 39px;
             padding-top: 16px;
         }
        .dtupload>a{
            color: #268eff;
            font-size: 12px;
            position: relative;
            left: 26px;
            top: 10px;
        }.dtupload>a:hover,
         .shoplogo>a:hover{
             color:#F93;
         }.upload_pic {
              height: 70px;
              width:70px;
              position: relative;
              cursor: pointer;
              color: #ccbe9e;
              background: #fff;
              overflow: hidden;
              display: inline-block;
              *display: inline;
              *zoom: 1;
          }
        .upload_pic input {
            position: absolute;
            height:100%;
            width:100%;
            right: 0;
            top: 0;
            opacity: 0;
            filter: alpha(opacity=0);
            cursor: pointer
        }
        .upload_pic:hover {
            color: #ccbe9e;
            background: #fff;
            text-decoration: none
        }
        .posabs{
            position: absolute;
            right: 23px;
            top: 9px;
        }

    </style>
</head>
<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins">

                <div class="ibox-content">
                    <form onsubmit="return  false" class="form-horizontal m-t" id="bizpersonForm">
                        <input id="id" value="${tSysUser.id}" name="id" type="hidden">
                        <div class="form-group">
                            <label class="col-sm-3 control-label">姓名：</label>
                            <div class="col-sm-8">
                                <input id="personName" value="${tSysUser.personName}" name="personName" class="form-control" type="text">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label">组织图片：</label>
                            <div class="col-sm-4">
                                <!--上传logo-->
                                <div class="dtupload">
                                    <a href="javascript:" class="upload_pic" style="height:80px;"><input type="file" name="fileToUpload" id="fileToUpload1" onChange="uploadFile('fileToUpload1','imgUpdate','shopPicId');">
                                        <img  id="imgUpdate" src="${pageContext.request.contextPath}/resources/image/logopic1.png" width="100%"/>
                                        <input type="hidden" id="coverId" name="coverId">
                                    </a>
                                </div>
                            </div>
                        </div>

                        <div class="form-group">
                            <label class="col-sm-3 control-label">组织名称：</label>
                            <div class="col-sm-8">
                                <input id="groupName" value="${tSysUser.groupName}" name="groupName" class="form-control" type="text" >
                            </div>
                        </div>

                        <div class="form-group">
                            <label class="col-sm-3 control-label">电话：</label>
                            <div class="col-sm-8">
                                <input id="phone" value="${tSysUser.phone}" name="phone" class="form-control" type="text" >
                            </div>
                        </div>

                        <div class="form-group">
                            <label class="col-sm-3 control-label">登录名：</label>
                            <div class="col-sm-8">
                                <input id="loginName" value="${tSysUser.loginName}" name="loginName" class="form-control" type="text">
                            </div>
                        </div>

                        <%--<div class="form-group">--%>
                            <%--<label class="col-sm-3 control-label">送券金额：</label>--%>
                            <%--<div class="col-sm-8">--%>
                                <%--<select class="form-control m-b" name="couponsMoney" >--%>
                                    <%--<c:choose>--%>
                                        <%--<c:when test="${bizperson.couponsMoney=='0'}">--%>
                                            <%--<option value="0" selected="selected">0元券</option>--%>
                                            <%--<option value="100">100元券</option>--%>
                                        <%--</c:when>--%>
                                        <%--<c:when test="${bizperson.couponsMoney=='10000'}">--%>
                                            <%--<option value="0" >0元券</option>--%>
                                            <%--<option value="100" selected="selected">100元券</option>--%>
                                        <%--</c:when>--%>
                                        <%--<c:otherwise>--%>
                                            <%--<option value="0" >0元券</option>--%>
                                            <%--<option value="100" >100元券</option>--%>
                                        <%--</c:otherwise>--%>
                                    <%--</c:choose>--%>
                                <%--</select>--%>
                            <%--</div>--%>
                        <%--</div>--%>

                        <div class="form-group">
                            <label class="col-sm-3 control-label">备注：</label>
                            <div class="col-sm-8">
                                <textarea id="notes" name="notes" class="form-control">${tSysUser.notes}</textarea>
                            </div>
                        </div>

                        <div class="form-group">
                            <label class="col-sm-3 control-label">所属区域：</label>
                            <div class="col-sm-3">
                                <select id="agent_province" data-placeholder="选择省份..." class="chosen-select"  value="${tSysUser.province}"  onchange="loadCity(this.value)"  name="province" class="form-control">
                                </select>
                            </div>
                            <div class="col-sm-3">
                                <select id="agent_city"  data-placeholder="选择城市..." class="chosen-select"   value="${tSysUser.city}" name="city" class="form-control" onchange="loadArea(this.value)">
                                </select>
                            </div>
                            <div class="col-sm-3">
                                <select id="agent_area"  data-placeholder="选择区..." class="chosen-select"   value="${tSysUser.area}" name="area" class="form-control">
                                </select>
                            </div>
                        </div>
                        <div class="form-group">
                            <div class="col-sm-8 col-sm-offset-3">
                                <input type="submit" class="btn btn-primary" value="提交" >
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>

<script src="${ctxStatic}/plugins/h+/js/jquery.min.js?v=2.1.4"></script>
<script src="${ctxStatic}/plugins/h+/js/bootstrap.min.js?v=3.3.6"></script>
<script src="${ctxStatic}/plugins/h+/js/plugins/bootstrap-table-master/bootstrap-table.js"></script>
<script src="${ctxStatic}/plugins/h+/js/plugins/bootstrap-table/bootstrap-table-mobile.min.js"></script>
<script src="${ctxStatic}/plugins/h+/js/plugins/bootstrap-table-master/locale/bootstrap-table-zh-CN.js"></script>
<script src="${ctxStatic}/plugins/h+/js/plugins/bootstrap-table-master/extensions/export/bootstrap-table-export.js"></script>
<script src="${ctxStatic}/plugins/h+/js/plugins/bootstrap-table-master/extensions/editable/bootstrap-table-editable.js"></script>
<script src="${ctxStatic}/plugins/h+/js/plugins/sweetalert/sweetalert.min.js"></script>
<script src="${ctxStatic}/plugins/h+/js/content.min.js?v=1.0.0"></script>
<script src="${ctxStatic}/plugins/h+/js/plugins/layer/laydate/laydate.js"></script>
<script src="${ctxStatic}/plugins/h+/js/plugins/validate/jquery.validate.min.js"></script>
<script src="${pageContext.request.contextPath}/resources/plugins/ajaxfileupload.js"></script>
<script src="${ctxStatic}/plugins/h+/js/plugins/chosen/chosen.jquery.js"></script>

<style>
    .fileInputContainer{
        width: 150px;
        background-size: 100% 100%;
        height: 150px;
        background-repeat: no-repeat;
    }
    .fileInput{
        position: absolute;
        top:30%;
        left:30%;
    }.upload_pic {
         height: 70px;
         width:70px;
         position: relative;
         cursor: pointer;
         color: #ccbe9e;
         background: #fff;
         overflow: hidden;
         display: inline-block;
         *display: inline;
         *zoom: 1;
     }
    .upload_pic input {
        position: absolute;
        height:100%;
        width:100%;
        right: 0;
        top: 0;
        opacity: 0;
        filter: alpha(opacity=0);
        cursor: pointer
    }
    .upload_pic:hover {
        color: #ccbe9e;
        background: #fff;
        text-decoration: none
    }
</style>
<script>
    var areaData;
    var index = parent.layer.getFrameIndex(window.name);
    var picPath='<%=ConfigUtil.get("OSSURL")%>';

    if('${tSysUser.id}'!=null){
        $("#imgUpdate").attr("src", picPath + '${tSysUser.coverId}');
        var coverId = '${tSysUser.coverId}';
        $("#coverId").val(coverId);
        var pro = '${tSysUser.province}';
        loadPr();
        $('#agent_city').chosen({
            no_results_text : "未找到此选项!",
            width:"100%"
        });
        $('#agent_area').chosen({
            no_results_text : "未找到此选项!",
            width:"100%"
        });

    }
    $(function(){
        $("#bizpersonForm").validate({
            submitHandler : function () {
                doSubmit();
            },
            rules:{
                personName:{
                    required:true,
                    maxlength:50
                },
                groupName:{
                    required:true,
                },
                phone:{
                    required:true,
                    checkPhone:true
                },
                notes:{
                    required:false,
                    maxlength:200
                }
                ,
                loginName:{
                    required:true,
                    maxlength:200
                }

            },
            messages:{
                personName:{
                    required:"*必填！",
                    maxlength:"*长度不能超过50位！"
                },
                groupName:{
                    required:"*必填！"
                },
                phone:{
                    required:"*必填！"
                },
                notes:{
                    required:"*必填！",
                    maxlength:"*长度不能超过200位！"
                },
                loginName:{
                    required:"*必填！",
                    maxlength:"*长度不能超过50位！"
                }
            },
            //是否在获取焦点时验证
            onfocusout:true,
            //是否在敲击键盘时验证
            //onkeyup:false,
            //提交表单后，（第一个）未通过验证的表单获得焦点
            focusInvalid:false,
            //当未通过验证的元素获得焦点时，移除错误提示
            focusCleanup:false
        });

        //自定义正则表达示验证方法
        $.validator.addMethod("checkPhone",function(value,element,params){
            var checkPhone = /^1[3,5,7,8]\d{9}$/;
            return this.optional(element)||(checkPhone.test(value));
        },"*请输入正确的手机号码！");

    });

    function uploadFile(obj,id,picId){//上传图片
        var labid = "";
        //var detailId = $("#detailId").val();
        //$("#"+id).css("background","url(${pageContext.request.contextPath}/resources/assets/images/waiting.gif) no-repeat 0 0/100% 100%");
        $.ajaxFileUpload({
            url: '${pageContext.request.contextPath}/common/doUploadFile.ac',
            secureuri: false,
            type:'post',
            fileElementId: obj,
            dataType: 'text',
            success: function(data, status) {
                var img=JSON.parse(data);
                $("#"+id).attr("src",picPath+img.path);
                $("#coverId").val(img.path);

            },
            error: function(data, status, e) {
                alert(e);
            }
        });
    }

    var areaData;
    $(function () {
        loadPr();
    });

    function loadPr()
    {
        $.ajax( {
            url:'${pageContext.request.contextPath}/area/getArea.ac',// 跳转到 action
            data:{},
            type:'post',
            cache:false,
            dataType:'json',
            success:function(data) {
                areaData=data;
                var html='<option value="">请选择</option>';
                for(var i=0;i<data.pro.length;i++)
                {

                    html+='<option value="'+data.pro[i].id+'">'+data.pro[i].text+'</option>';

                }
                $("#agent_province").html(html);
                $('#agent_province').chosen({
                    no_results_text : "未找到此选项!",
                    width:"100%"
                });
                if(('${tSysUser.province}')!=null&&'${tSysUser.province}'!=''&&'${tSysUser.province}'!=undefined)
                {
                    $("#agent_province").val('${tSysUser.province}');
                    $("#agent_province").trigger("chosen:updated");
                    loadCity('${tSysUser.province}');
                }
            },
            error : function() {
                alert("加载代理商列表失败！");
            }
        });
    }
    function loadCity(id)
    {
        var data=areaData;
        var html='<option value="">请选择</option>';
        $("#agent_city").html(html);
        $("#agent_city").trigger("chosen:updated");
        $("#agent_area").html(html);
        $("#agent_area").trigger("chosen:updated");
        for(var i=0;i<data.city.length;i++)
        {
            if(data.city[i].pid==id)
            {
                html+='<option value="'+data.city[i].id+'">'+data.city[i].text+'</option>';
            }
        }
        $("#agent_city").html(html);
        $("#agent_city").trigger("chosen:updated");
        if('${tSysUser.city}'!=null&&'${tSysUser.city}'!=''&&'${tSysUser.city}'!=undefined&&id=='${tSysUser.province}')
        {
            $("#agent_city").val('${tSysUser.city}');
            $("#agent_city").trigger("chosen:updated");
            loadArea('${tSysUser.city}');
        }
    }
    function loadArea(id)
    {
        var data=areaData;
        var html='<option value="">请选择</option>';
        for(var i=0;i<data.area.length;i++)
        {
            if(data.area[i].pid==id)
            {
                html+='<option value="'+data.area[i].id+'">'+data.area[i].text+'</option>';
            }
        }
        $("#agent_area").html(html);
        $("#agent_area").trigger("chosen:updated");
        $('#agent_area').chosen({
            no_results_text : "未找到此选项!",
            width:"100%"
        });
        if('${tSysUser.area}'!=null&&'${tSysUser.area}'!=''&&'${tSysUser.area}'!=undefined) {
            $("#agent_area").val('${tSysUser.area}');
            $("#agent_area").trigger("chosen:updated");
        }
    }


    function doSubmit()
    {
        var coverId=$("#coverId").val();//logo
        if(coverId==null||coverId==undefined||coverId==''){alert("请上传图片");return;}
        $.ajax( {
            url:'${pageContext.request.contextPath}/bizperson/doSave.ac',// 跳转到 action
            data:$("#bizpersonForm").serialize(),
            type:'post',
            cache:false,
            dataType:'json',
            success:function(data) {
                if(data.success==true) {
                    parent.swal("操作成功！", "您已经保存了这条信息。", "success");

                    parent.layer.close(index);
                }else {
                    swal("操作失败",data.msg,"error");
                }
            },
            error : function() {
                alert("操作失败！");
            }
        });
    }


</script>

</body>

</html>

